

		
		<style type="text/css">
#container {
	min-width: 300px;
	max-width: 600px;
	margin: 0 auto;
}
		</style>
		<script type="text/javascript">
$(function () {
    var data = {
        "鲜活健康": {
            "冬瓜茶 (大)": {
                "1/1": "120",
                "1/2": "180",
                "1/3": "240",
                "1/4": "256",
                "1/5": "168",
                "1/6": "300",
                "1/7": "324",
                "1/8": "132",
                "1/9": "252",
                "1/10": "96"
            },
            "冬瓜茶 (中)": {
                "1/1": "90",
                "1/2": "80",
                "1/3": "110",
                "1/4": "130",
                "1/5": "190",
                "1/6": "230",
                "1/7": "140",
                "1/8": "120",
                "1/9": "190",
                "1/10": "60"
            },
            "冬瓜嫩仙草 (大)": {
                "1/1": "154",
                "1/2": "238",
                "1/3": "266",
                "1/4": "294",
                "1/5": "476",
                "1/6": "126",
                "1/7": "280",
                "1/8": "336",
                "1/9": "224",
                "1/10": "84"
            },
            "冬瓜嫩仙草 (中)": {
                "1/1": "121",
                "1/2": "187",
                "1/3": "209",
                "1/4": "231",
                "1/5": "374",
                "1/6": "99",
                "1/7": "220",
                "1/8": "264",
                "1/9": "176",
                "1/10": "66"
            },
            "冬瓜柠檬 (大)": {
                "1/1": "165",
                "1/2": "255",
                "1/3": "285",
                "1/4": "315",
                "1/5": "510",
                "1/6": "135",
                "1/7": "300",
                "1/8": "360",
                "1/9": "240",
                "1/10": "90"
            },
            "冬瓜柠檬 (中)": {
                "1/1": "132",
                "1/2": "204",
                "1/3": "228",
                "1/4": "252",
                "1/5": "408",
                "1/6": "108",
                "1/7": "240",
                "1/8": "288",
                "1/9": "192",
                "1/10": "72"
            }
        },
        "鲜奶拿铁": {
        	"铁观音拿铁": {
                "1/1": "480",
                "1/2": "360",
                "1/3": "456",
                "1/4": "480",
                "1/5": "288",
                "1/6": "312",
                "1/7": "432",
                "1/8": "216",
                "1/9": "480",
                "1/10": "672"
            },
        	"红茶拿铁": {
                "1/1": "400",
                "1/2": "300",
                "1/3": "380",
                "1/4": "400",
                "1/5": "240",
                "1/6": "260",
                "1/7": "360",
                "1/8": "180",
                "1/9": "400",
                "1/10": "560"
            },
        	"烤茶拿铁": {
                "1/1": "420",
                "1/2": "315",
                "1/3": "399",
                "1/4": "420",
                "1/5": "252",
                "1/6": "273",
                "1/7": "378",
                "1/8": "189",
                "1/9": "420",
                "1/10": "588"
            },     
        	"抹茶拿铁": {
                "1/1": "440",
                "1/2": "330",
                "1/3": "418",
                "1/4": "440",
                "1/5": "264",
                "1/6": "286",
                "1/7": "396",
                "1/8": "198",
                "1/9": "440",
                "1/10": "616"
            }, 
        	"仙草冻拿铁": {
                "1/1": "424",
                "1/2": "518",
                "1/3": "128",
                "1/4": "246",
                "1/5": "412",
                "1/6": "376",
                "1/7": "198",
                "1/8": "206",
                "1/9": "288",
                "1/10": "186"
            },
        	"珍珠鲜奶茶": {
                "1/1": "468",
                "1/2": "498",
                "1/3": "596",
                "1/4": "386",
                "1/5": "412",
                "1/6": "488",
                "1/7": "380",
                "1/8": "296",
                "1/9": "508",
                "1/10": "588"
            }                                          
        },
        "新鲜特调": {
        	"梅子绿茶": {
                "1/1": "170",
                "1/2": "256",
                "1/3": "146",
                "1/4": "228",
                "1/5": "292",
                "1/6": "256",
                "1/7": "364",
                "1/8": "124",
                "1/9": "242",
                "1/10": "272"
            },
        	"蜂蜜绿茶": {
                "1/1": "192",
                "1/2": "246",
                "1/3": "152",
                "1/4": "132",
                "1/5": "148",
                "1/6": "258",
                "1/7": "196",
                "1/8": "284",
                "1/9": "160",
                "1/10": "288"
            },
        	"百香绿茶": {
                "1/1": "146",
                "1/2": "242",
                "1/3": "234",
                "1/4": "146",
                "1/5": "232",
                "1/6": "128",
                "1/7": "262",
                "1/8": "284",
                "1/9": "292",
                "1/10": "168"
            },     
        	"柠檬绿茶": {
                "1/1": "168",
                "1/2": "212",
                "1/3": "208",
                "1/4": "186",
                "1/5": "244",
                "1/6": "312",
                "1/7": "142",
                "1/8": "98",
                "1/9": "120",
                "1/10": "222"
            }, 
        	"柠檬青茶": {
                "1/1": "108",
                "1/2": "122",
                "1/3": "134",
                "1/4": "168",
                "1/5": "124",
                "1/6": "162",
                "1/7": "108",
                "1/8": "116",
                "1/9": "92",
                "1/10": "78"
            },
        	"土芒果绿茶": {
                "1/1": "88",
                "1/2": "94",
                "1/3": "124",
                "1/4": "68",
                "1/5": "40",
                "1/6": "84",
                "1/7": "62",
                "1/8": "108",
                "1/9": "94",
                "1/10": "112"
            },
        	"甘蔗青茶": {
                "1/1": "208",
                "1/2": "212",
                "1/3": "268",
                "1/4": "312",
                "1/5": "198",
                "1/6": "220",
                "1/7": "248",
                "1/8": "308",
                "1/9": "420",
                "1/10": "298"
            },
        	"多多绿茶": {
                "1/1": "302",
                "1/2": "398",
                "1/3": "404",
                "1/4": "362",
                "1/5": "488",
                "1/6": "320",
                "1/7": "408",
                "1/8": "284",
                "1/9": "280",
                "1/10": "232"
            },
        	"青酿梅绿": {
                "1/1": "98",
                "1/2": "104",
                "1/3": "76",
                "1/4": "154",
                "1/5": "108",
                "1/6": "26",
                "1/7": "88",
                "1/8": "56",
                "1/9": "90",
                "1/10": "88"
            },
        	"葡萄柚绿茶": {
                "1/1": "194",
                "1/2": "254",
                "1/3": "396",
                "1/4": "362",
                "1/5": "306",
                "1/6": "278",
                "1/7": "206",
                "1/8": "488",
                "1/9": "506",
                "1/10": "212"
            }                                              
        },  
        "夏季冰钻": {
        	"翡翠柠檬": {
                "1/1": "906",
                "1/2": "608",
                "1/3": "456",
                "1/4": "732",
                "1/5": "458",
                "1/6": "670",
                "1/7": "586",
                "1/8": "692",
                "1/9": "508",
                "1/10": "408"
            },
        	"翡翠菠萝": {
                "1/1": "106",
                "1/2": "208",
                "1/3": "156",
                "1/4": "132",
                "1/5": "158",
                "1/6": "170",
                "1/7": "186",
                "1/8": "192",
                "1/9": "108",
                "1/10": "208"
            },
        	"桂花乌梅冰钻": {
                "1/1": "196",
                "1/2": "168",
                "1/3": "146",
                "1/4": "172",
                "1/5": "148",
                "1/6": "160",
                "1/7": "156",
                "1/8": "162",
                "1/9": "258",
                "1/10": "148"
            }                                        
        },
        "东方时尚": {
        	"东方美人": {
                "1/1": "288",
                "1/2": "292",
                "1/3": "168",
                "1/4": "222",
                "1/5": "342",
                "1/6": "190",
                "1/7": "274",
                "1/8": "372",
                "1/9": "100",
                "1/10": "282"
            },
            "阿里山金萱": {
                "1/1": "192",
                "1/2": "274",
                "1/3": "132",
                "1/4": "296",
                "1/5": "362",
                "1/6": "252",
                "1/7": "184",
                "1/8": "226",
                "1/9": "126",
                "1/10": "108"
            },
            "安溪铁观音": {
                "1/1": "192",
                "1/2": "274",
                "1/3": "332",
                "1/4": "196",
                "1/5": "262",
                "1/6": "152",
                "1/7": "284",
                "1/8": "326",
                "1/9": "126",
                "1/10": "208"                                         
        }        
            }, 
        "香醇奶茶": {
        	"台北迎嘉珍奶": {
                "1/1": "788",
                "1/2": "362",
                "1/3": "688",
                "1/4": "498",
                "1/5": "606",
                "1/6": "462",
                "1/7": "358",
                "1/8": "408",
                "1/9": "678",
                "1/10": "382"
            },
        	"台北迎嘉奶茶": {
                "1/1": "288",
                "1/2": "162",
                "1/3": "288",
                "1/4": "398",
                "1/5": "206",
                "1/6": "162",
                "1/7": "158",
                "1/8": "208",
                "1/9": "278",
                "1/10": "182"
            },
        	"台北迎嘉奶绿": {
                "1/1": "128",
                "1/2": "232",
                "1/3": "448",
                "1/4": "218",
                "1/5": "126",
                "1/6": "312",
                "1/7": "258",
                "1/8": "128",
                "1/9": "248",
                "1/10": "182"
            }                                     
        }                   
    },
        points = [],
        region_p,
        region_val,
        region_i,
        country_p,
        country_i,
        cause_p,
        cause_i,
        cause_name = [],
        region,
        country,
        cause;
    cause_name['1/1'] = '1/1';
    cause_name['1/2'] = '1/2';
    cause_name['1/3'] = '1/3';
    cause_name['1/4'] = '1/4';
    cause_name['1/5'] = '1/5';
    cause_name['1/6'] = '1/6';
    cause_name['1/7'] = '1/7';
    cause_name['1/8'] = '1/8';
    cause_name['1/9'] = '1/9';
    cause_name['1/10'] = '1/10';
    region_i = 0;
    for (region in data) {
        if (data.hasOwnProperty(region)) {
            region_val = 0;
            region_p = {
                id: "id_" + region_i,
                name: region,
                color: Highcharts.getOptions().colors[region_i]
            };
            country_i = 0;
            for (country in data[region]) {
                if (data[region].hasOwnProperty(country)) {
                    country_p = {
                        id: region_p.id + "_" + country_i,
                        name: country,
                        parent: region_p.id
                    };
                    points.push(country_p);
                    cause_i = 0;
                    for (cause in data[region][country]) {
                        if (data[region][country].hasOwnProperty(cause)) {
                            cause_p = {
                                id: country_p.id + "_" + cause_i,
                                name: cause_name[cause],
                                parent: country_p.id,
                                value: Math.round(+data[region][country][cause])
                            };
                            region_val += cause_p.value;
                            points.push(cause_p);
                            cause_i = cause_i + 1;
                        }
                    }
                    country_i = country_i + 1;
                }
            }
            region_p.value = Math.round(region_val / country_i);
            points.push(region_p);
            region_i = region_i + 1;
        }
    }
    $('#container').highcharts({
        series: [{
            type: "treemap",
            layoutAlgorithm: 'squarified',
            allowDrillToNode: true,
            dataLabels: {
                enabled: false
            },
            levelIsConstant: false,
            levels: [{
                level: 1,
                dataLabels: {
                    enabled: true
                },
                borderWidth: 3
            }],
            data: points
        }],
        subtitle: {
        	text: '销售金额比较',
            style: { 
                    fontWeight: 'bold',
                    fontSize: '16px', 
                    fontFamily: '微軟正黑體',
                    color:'black'
                   }
        	},
        title: {
            text: '销售状况比较表(依日)',
            style: { 
                    fontWeight: 'bold',
                    fontSize: '20px', 
                    fontFamily: '微軟正黑體',
                    color:'black'
                   }
        },
    });
});
		</script>
	</head>
	<body>
<script src="../../../frameworks/highcharts/js/highcharts.js"></script>
<script src="../../../frameworks/highcharts/js/modules/heatmap.js"></script>
<script src="../../../frameworks/highcharts/js/modules/treemap.js"></script>
<div id="container"></div>